<template>
  <div id="vbind01">
    <!-- v-model一般用于选择框 -->
    <label for="r1">修改颜色</label><input type="checkbox" v-model="use" id="r1">
    <br><br>
    <div v-bind:class="{'class1': use}">
      v-bind:class 指令
    </div>
  </div>
</template>

<script>
    export default {
      el: '#vbind01',
      data(){
        return {
          use: false
        }
      }
    }
</script>
<!-- 该style 跟上面的 class1关联-->
<style>
  .class1{
    background: #444;
    color: #eee;
  }
</style>



